<!--
 * @Author: chenwenjie
 * @Date: 2021-05-28 11:00:19
 * @LastEditTime: 2021-05-29 00:52:00
 * @LastEditors: chenwenjie
 * @Description: 
 * @FilePath: \tian-project\src\components\Header.vue
-->
<template>
  <div>
    <header>
      <div class="leftTitle">
        <img src="../assets/images/head01.png" alt="" />
      </div>
      <div class="midSearch">
        <a-input-search size="large" placeholder="搜索课程" enter-button  />
      </div>
      <div class="rightLogin">
        <span class="carShop">
          <svg
            t="1622210459631"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="1271"
            width="20"
            height="20"
          >
            <path
              d="M289.92 768c2.56 0 632.32 0 639.36 0 14.72 0 26.24-12.8 28.16-28.8 0 0 43.52-244.48 64-413.44C1027.2 279.04 1004.8 256 961.92 256L264.96 256 253.44 156.16C251.52 140.8 240.64 128 226.56 128 224.64 128 97.92 128 97.92 128c-17.92 0-32 14.08-32 32 0 17.92 14.08 32 32 32l99.84 0 64.64 547.2C263.68 755.2 275.84 768 289.92 768zM960.64 320c-17.28 135.68-46.08 316.16-57.6 384L318.08 704 272.64 320 960.64 320zM321.92 832c-35.2 0-64 28.8-64 64 0 35.2 28.8 64 64 64 35.2 0 64-28.8 64-64C385.92 860.8 357.12 832 321.92 832zM897.92 832c-35.2 0-64 28.8-64 64 0 35.2 28.8 64 64 64 35.2 0 64-28.8 64-64C961.92 860.8 933.12 832 897.92 832z"
              p-id="1272"
              fill="#8a8a8a"
            ></path>
          </svg>
        </span>
        <span style="margin:5px 8px;">
          <svg
            t="1622217191355"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="1763"
            width="18"
            height="18"
          >
            <path
              d="M531.185456 943.532317c0 8.899694-6.493901 16.114003-14.503319 16.114003l-9.364275 0c-8.010441 0-14.504342-7.214309-14.504342-16.114003L492.81352 80.46666c0-8.898671 6.493901-16.114003 14.504342-16.114003l9.364275 0c8.009418 0 14.503319 7.215332 14.503319 16.114003L531.185456 943.532317z"
              p-id="1764"
            ></path>
          </svg>
        </span>
        <span style="color:black">登录/注册</span>
        <!-- 用户 -->
        <span  style="margin:-5px 0 10px 5px;">
          <svg
            t="1622211423863"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="2409"
            width="32"
            height="32"
          >
            <path
              d="M512 962C263.488 962 62 760.513 62 512S263.488 62 512 62s450 201.488 450 450-201.488 450-450 450z m0-825c-207.113 0-375 167.887-375 375s167.887 375 375 375 375-167.888 375-375-167.888-375-375-375z m0 675a299.4 299.4 0 0 1-234-112.5A299.4 299.4 0 0 1 512 587a299.25 299.25 0 0 1 233.962 112.5A299.25 299.25 0 0 1 512 812z m0-262.5a150 150 0 1 1 0-300 150 150 0 0 1 0 300z"
              p-id="2410"
              fill="#cdcdcd"
            ></path>
          </svg>
        </span>
      </div>
    </header>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
};
</script>
<style scoped less>
header {
  width: 1200px;
  height: 100px;
  padding-top: 20px;
  margin: 0 auto;
  /* background: bisque; */
  box-sizing: border-box;
}
.leftTitle {
  width: 400px;
  float: left;
}
.leftTitle img {
  width: 180px;
}

.midSearch {
  width: 400px;
  float: left;
  padding-top: 15px;
}
.rightLogin {
  margin-left: 20px;
  margin-top: 20px;
  width: 200px;
  float: right;
  display: flex;
  cursor: pointer;
}

/deep/.ant-input-group .ant-input{
  border-radius: 35px;
}
</style>

